<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
	<meta charset="UTF-8">
	<title>安迅物流-对外开放平台</title>
    <link rel="stylesheet" type="text/css" href="common/easyui/themes/bootstrap/easyui.css">   
	<link rel="stylesheet" type="text/css" href="common/easyui/themes/icon.css">  
	<script type="text/javascript" src="common/js/jquery.min.js"></script>
    <script type="text/javascript" src="common/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="common/js/jquery.i18n.properties.js"></script>
    <script type="text/javascript" src="common/easyui/locale/easyui-lang-zh_CN.js"></script>
    <style type="text/css">
			body{
				margin: 0;
				padding: 0;
			}
			video{
				position: fixed;
				left: 0;
				top: 0;
				z-index: -9999;
				width: 100%;
				-webkit-filter: grayscale(25%);
			}
        .form{
				position: absolute;
				width: 252px;
				height: 255px;
				background: white;
				border-bottom: blue 2px;
				border-right: blue 2px;
				border-radius: 5%;
				top: 34%;
				left: 70%;
				
			}
        .top{
			position: absolute;
			height: 9%;
			width: 74%;
			left: 12%;
			top: 10%;
		 }
			.user {
					padding-left: 10px;
					border-radius: 5px;
					margin: 34% 9% 13% 10%;
					border: 1px solid #D6D6D6;
					height: 38px;
			}
			.user_user{
				margin: 6% 4% -26% -2%;
				float: left;
				width: 10%;
			}
			.user_input{
				outline-style: unset;
				box-sizing: border-box;
				margin: 5% 0% 0% 13%;
				border: 0px;
				font-size: 17px;
				width: 77%;
			    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
			}
			.pd{
					padding-left: 10px;
					border-radius: 5px;
					margin: -7% 9% 10% 10%;
					border: 1px solid #D6D6D6;
					height: 35px;
			}
			.pasd{
				margin: 5% 0% 0% -1%;
				float: left;
				width: 8%;
			}
			.pasd_input{
				outline-style: unset;
				box-sizing: border-box;
				margin: 4% 0% 0% 6%;
				border: 0px;
				font-size: 100%;
				width: 78%;
			    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
			}
			.login{
					padding-left: 0%;
					border-radius: 5px;
					margin: -1% 0% 0% 11%;
					border: 1px solid #D6D6D6;
					font-size: 100%;
					height: 38px;
					width: 80%;
					background: rgba(20,106,233,1);
					color: white;
			}
			.errorMsg{
				margin: -12% 0% 0% 11%;
				float: left;
				width: 97%;
				font-size: 69%;
			}
			input::-webkit-input-placeholder { /* WebKit browsers */
				color: #D3D3D5;
			}
    </style>
</head>
<body class="easyui-layout">
 <video autoplay loop="loop">  
    <source src="common/images/bg5.mp4" type="video/mp4">
</video>  

            <div id="content" class="form">
            	<div >
					<img src="common/images/bt2.png" class="top"/>
				</div>
		    	<form id="loginForm" action="login.json" method="post" onsubmit="return $.LmisLoginUtils.validate();">
		    	    <input type="hidden" id="imageId" name ="imageId" value="${imageId}" />
		    	     <input type="hidden" id="loginErrorMsg" name ="loginErrorMsg" value="${loginErrorMsg}" />

					<div class="errorMsg" style="color:#F00">
						${error}
					</div>
					<div class="user" >
						<img src="common/images/man2.png" class="user_user" />
						<input type="text" name="username" id="username" class="user_input" placeholder="请输入用户名" data-options="required:true, novalidate:true" value="${username}" />
					</div>
					<div class="pd" >
						<img src="common/images/key2.png" class="pasd" />
						<input type="password" name="password" id="password" class="pasd_input" placeholder="请输入密码" onkeyup="$.LmisLoginUtils.setValue(password)" data-options="required:true, novalidate:true" value="" />
					</div>
					<div  id = "loginBtn">
						<button id="loginBtn" class="login">登录</button> 
					</div>
		        </form>
            </div>

<!-- Javascript 代码 -->
<script type="text/javascript" src="common/js/login/login.js"></script>
<script>
		$(function(){ 
			refreshCode(false);
			//if("${domainType}" == "Intranet"){
				$("#tr_hidden").hide(); 
				$("#validationCode").removeAttr("class");
				$('#tr_code').hide();
			//}
			//获取用户登陆失败信息
			var loginErrorMsg = document.getElementById('loginErrorMsg').value
			if(null != loginErrorMsg && '' != loginErrorMsg){
				$.messager.alert('登陆失败', loginErrorMsg, 'info');
				//隐藏登陆按钮
				$("#tr_login").hide();
				//隐藏获取验证码按钮
				$("#validationCode").removeAttr("class");
				//隐藏验证码输入框
				$('#tr_code').hide();
				//展示跳转绑定手机号按钮
				$('#tr_bind').show();
				//密码输入框置灰
				document.getElementById("password").disabled = 'disabled';
				document.getElementById("bindBtn").onclick = function(){
					//跳转绑定手机号页面
					var username = document.getElementById("username").value
					location.href = 'bindMobileView.do?username=' + username
				}
			}
		}); 
		/**
		 * 刷新验证码
		 * @param imgObj 验证码Img元素
		 */
		function refreshCode(imgObj) {
			if (!imgObj) {
				var imgObj = document.getElementById("validationC");
			}
			var imageId = document.getElementById("imageId");
			//imgObj.src = "validationCodeServlet.png?" + Math.random()+ "&imageId=" + imageId.value;
		}
		
		/**
		 * 发送手机验证码
		 * @param imgObj 验证码Img元素
		 */
		function phoneValidation(){
			//获取输入用户名
			var username = $("#username").val();
			if('' == username){
				alert("用户名未输入");
				return;
			}
			//发送验证码信息
			$.ajax({
				url: 'phoneValidation.do',
				type:'post',
				data:{'username':username},
				success:function(data){
					alert(data);
				}
			});
		}
</script>
</body>
</html>
